html,body,#app,#home {height: 100%;box-sizing: border-box;overflow: hidden;}
::-webkit-scrollbar {width: 7px; height: 7px;}
::-webkit-scrollbar-thumb {border-radius: 3px;background: rgba(170, 170, 170, 0.7);box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.2);}
body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select{margin:0;padding:0}
*, :after, :before {box-sizing: border-box;}
li{list-style:none}
img{border:0;vertical-align:middle}
a{text-decoration: none;}

.dis3{height:3px;line-height:3px;clear:both;}
.dis5{height:5px;line-height:5px;clear:both;}
.dis7{height:7px;line-height:7px;clear:both;}
.dis9{height:9px;line-height:9px;clear:both;}
.dis10{height:10px;line-height:10px;clear:both;}
.dis15{height:15px;line-height:15px;clear:both;}
.dis17{height:17px;line-height:17px;clear:both;}
.dis20{height:20px;line-height:20px;clear:both;}
.dis25{height:25px;line-height:25px;overflow:hidden;clear:both;}
.dis30{height:30px;line-height:30px;clear:both;}
.dis40{height:40px;line-height:40px;clear:both;}
.dis60{height:60px;line-height:60px;clear:both;}
.dis120{height:120px;line-height:120px;clear:both;}
.font-sgray {color:#ccc !important;}
.font-gray {color:#7d8c91 !important;}
.font-gray2 {color:#ababab !important;}

.font-org,.font-org:hover {color:#ff6f02 !important;}
.font-red {color:#f00 !important;}
.font-gray,.font-gray:hover {color:#7d8c91 !important;}
.font-black,.font-black:hover {color:#333 !important;}
.font-white,.font-white:hover  {color:#fff !important;}
.font-yellow,.font-yellow:hover {color:#fffc00 !important;}
.font-green,.font-green:hover {color:#009f3d !important;}
.font-blue2,.font-blue2:hover {color:#195ea1 !important;}
.font-blue,.font-blue:hover {color:#1598db !important;}

.w100 {max-width: 100px !important;}
.w200 {max-width: 200px !important;}
.w300 {max-width: 300px !important;}
.w400 {max-width: 400px !important;}
.w500 {max-width: 500px !important;}
.w600 {max-width: 600px !important;}

.tl{text-align:left;}.tr{text-align:right;}.tc{text-align:center;}.tdindent28{text-indent:28px;}.tdindent24{text-indent:24px;}
.f9{font-size:9px !important;}.f10{font-size:10px !important;}.f11{font-size:11px !important;}.f12{font-size:12px !important;}.f14{font-size:14px !important;}.f16{font-size:16px !important;}.f18{font-size:18px !important;}.f20{font-size:20px !important;}.f24{font-size:24px !important;}.fb{font-weight:700 !important;}.fn {font-weight:400 !important;}
.fl {float:left;}.fr {float:right;}.cl {clear:both;}

.inblock {display: inline-block;}

/* header */
.lw {width: 180px;}
.aps9 {width: 98%;margin: 0 auto;}
.aps8 {width: 80%;margin: 0 auto;}
.aps7 {width: 70%;margin: 0 auto;}
.header {
  width: 100%;height: 60px;position: fixed;top: 0; left: 0;z-index: 1;background-color: #fff;background-image: linear-gradient(143deg,#fff 20%,#fff 81%,#efefef);
  /*box-shadow: inset 0 5px 5px 0 rgba(0,0,0,.1);*/
  border-bottom: solid 1px #e0e0e0;
}
.header-logo {width: 180px;float: left;height: 60px;}
.header-logo .logo {display: inline-block;padding: 9px 0 0 12px;}
.header-logo .text {display: inline-block;margin-top:21px; font-size:14px;height: 14px;line-height: 14px;border-left: solid 1px #fff;opacity: .69; margin-left: 7px; padding-left:7px;color:#fff;}

.header-nav {width: 50%;float:left;padding-left: 30px;}
.header-nav a {display: inline-block; margin-right: 40px;position: relative;height: 60px; line-height: 60px;opacity: .69;transition: all .2s ease-in-out;color:#555;}
.header-nav a.cur,.header-nav a:hover {opacity: 1;}
.header-nav a.cur:after {content: "";width: 100%;position: absolute;left: 0; bottom: 0; height: 4px; background-color: #4fe3c1;} 

.header-right {float: right; width: 30%;text-align: right;padding-right:0px;}
.header .iconbtn {cursor:pointer;display: inline-block; padding:0px 23px;position: relative;height: 60px; line-height: 60px;opacity: .93;transition: all .2s ease-in-out;color:#333;}
.header .iconbtn:hover {opacity: 1;background: #efefef;color:#f60;}
.header .iconbtn div.over-box {display: none; position: absolute;top:60px;right: 0px; min-width: 200px; min-height: 60px; background-color:#fff;box-shadow: 1px 2px 1px 0 rgba(0,0,0,.1);}
.header .iconbtn:hover div.over-box  {display: block;border-bottom: solid 1px #e1e1e1;border-left:solid 1px #e1e1e1;}

.header .iconbtn div.over-box ul li {color:#777;text-align: left;}
.header .iconbtn div.over-box ul li a {color:#777;margin: 0;}
.header .iconbtn div.over-box ul li a {display:block; padding: 0 30px;height: 48px; line-height: 48px;}
.header .iconbtn div.over-box ul li a:hover {background-color:#f3f3f3;}
.header .iconbtn div.over-box ul li a span.avatar {margin-right:20px; display: inline-block;width:28px;height: 28px; line-height: 28px;font-size:14px;text-align: center; border-radius: 50%;background-color:#3860f4;color:#fff;}
.header .iconbtn div.over-box ul li.line {height: 1px;line-height: 1px; background-color:#efefef;}


.header .header-nav  div.over-box {left: 0px;}
.header .header-nav  div.over-box ul li {position: relative;}
.header .header-nav  div.over-box ul li a {color:#222;margin: 0; position: relative;}
.header .header-nav  div.over-box ul li span.vbtn {position: absolute;top:-9px;right:11px;}
/* end header */
/* layout */
.home-1 {}
.home-2 {padding-left:180px;}
.leftnav {position: fixed;width: 180px;top:60px;left:0;bottom:0px;border-right: 1px solid #d7dde4;background-color:#fff;}
.leftnav .navbox {padding: 10px 0;}
.leftnav .navbox dl dt {height: 42px;line-height: 42px;padding: 0 24px; font-size:14px;cursor: pointer;}
.leftnav .navbox dl dt i.arrow {float: right; margin-top: 15px;}
.leftnav .navbox dl dd {}
.leftnav .navbox dl dd a{display:block;height: 42px;line-height: 42px; padding: 0 24px; font-size:12px; color:#555;}
.leftnav .navbox dl dd.sub a {padding-left: 48px;}
.leftnav .navbox dl dd a:hover {background:#f3f3f3;}
.leftnav .navbox dl dd a.cur {color:#ff6c1a;font-weight: 700;}
.show-nav-btn {width: 26px;height: 26px;position: fixed; top:77px;left:8px;cursor:pointer;z-index: 999;background-image: url('/static/erp/arrow.png');}
.hide-nav-btn {width: 26px;height: 26px;position: fixed; top:77px;left:167px;cursor:pointer;z-index: 999;background-image: url('/static/erp/arrow-left.png');}
.hide-nav-btn a,.show-nav-btn a{display: block;width: 26px;height: 26px;}
.leftnav .navtitle {font-size: 18px;padding: 0 24px; height: 48px;line-height: 48px;color:#777;}
.view-wrap {height: 100%; padding-top: 60px; overflow:hidden;background: #ededed;}

.view-combox {height: 100%; width: 100%;padding-left: 140px;position: relative;}
.view-combox .subnav2 {position: absolute;top:0;left:0px;bottom:0px;width:140px;background-color: #fff;border-right: solid 1px #e0e0e0;}
.view-combox .subnav2 .nav2 {padding-top: 60px;overflow: auto;}
.view-combox .subnav2 .nav2 li {}
.view-combox .subnav2 .nav2 li a {
  display: block;
  height: 40px;
  line-height: 40px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  vertical-align: middle;
  color: #262626;
  font-size: 12px;
  padding: 0 24px;
}
.view-combox .subnav2 .nav2 li a.cur {color:#3860f4;font-weight: 700;}
/* end layout */

/* editbox */
.cards {background: #fff; box-shadow: 0 2px 3px 0 rgba(0,0,0,.2);}
.scrollbox {height: 100%;overflow-y:auto;}
.editbox {}
.editbox {padding: 30px 30px 60px 30px;}
.listbox {}


/******** element ui 覆盖 ********/
.el-button {border-radius: 0px !important;}
.el-button--primary {background-color:#ff6c1a !important; border-color:#ff6c1a !important;}
.el-select-dropdown, .el-input__inner,.el-textarea__inner,.el-picker-panel,.el-input-group__append, .el-input-group__prepend {border-radius: 0px !important;}
.el-select-dropdown .popper__arrow {display: none !important;}



/* table */

table.table {width:100%;margin:0 auto;border:0;margin:0;border-collapse:collapse;border-spacing:0;}
table.table th {font-weight: 700; font-size:12px;color:#666; padding: 11 13px;background-color: #fff;}
table.table th i {cursor: pointer;}
table.table th,table.table td {text-align: left;border-bottom:solid 1px #efefef;padding: 7px 13px;}
table.table td {padding: 17px 13px; font-size:12px;}

table.table tbody tr:hover td {background-color: #fafafa;}
table.table tbody tr:nth-child(odd){ background-color: #fff;}
/*设置偶数行颜色*/
table.table tbody tr:nth-child(even){ background-color: #fafafa;}


table.border {}
table.border th ,table.border td {border:solid 1px #efefef;line-height: 22px; }
table.dens th,table.dens td {text-align: left}
table.border {}
table.table tr td > div {position: relative;}
table.table tr td .batch-op-row {position: absolute;top:-12px;right:0;width:300px;text-align: right;}

table tr.red td,table tr.red th {background: #f2dede}
table tr.yellow td,table tr.yellow th {background: #fcf8e3}
table tr.blue td,table tr.blue th {background: #d9edf7}
table tr.green td,table tr.green th {background: #dff0d8}
table tr.gray td,table tr.gray th {background: #f5f5f5}

table.table tr td > div.pagebar {padding: 0 3px;}

.nodata {padding: 30px 0; text-align: center; color:#999;}
/* end table */

.box-table-head, .box-table-head tr:hover {background:#eff9ff;}
.box-table-head th {height: 48px;line-height: 48px;font-size:12px;color:#777;font-weight: 400;}
.box-table-foot td {height: 42px;line-height: 42px;}

/*关键设置 tbody出现滚动条*/
.box-table-list {
  padding-bottom: 5px;
  box-sizing: border-box;
  overflow-y: auto;
  overflow-x: hidden;
  position: absolute;
  top:49px;left:0;right:0;bottom:42px;
}
.box-table-list tbody tr:hover{ background-color: #f5f7fa;}
.box-table-foot {position: absolute; left: 0px; right: 0px; bottom: 0px; height: 42px; line-height: 42px;}
.formedit-box {padding: 20px 12px 12px 52px;}
input[type=checkbox]{
  /*同样，首先去除浏览器默认样式*/
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /*编辑我们自己的样式*/
  position: relative;
  width: 15px;
  height: 15px;
  background: #fff;
  border:1px solid #ccc;
  outline: none;
  cursor: pointer;
}
input[type=checkbox]:after{
  content: '\2713';
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  background: #3860f4;  
  color: #fff;
  text-align: center;
  line-height: 13px;
  opacity: 0;
}
input[type=checkbox]:checked:after{
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  opacity: 1;
}
input[type=checkbox]:checked {
  border:1px solid #3860f4;
}
/*======公共头部导航======*/

/*========云主机列表系统图片========*/
.systemImage0{
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url('/static/img/server-icon.png') 100% no-repeat;
  background-position: 0 4px;
}
.systemImage1{
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url('/static/img/server-icon.png') 100% no-repeat;
  background-position: 0 -26px;
}
.systemImage2{
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url('/static/img/server-icon.png') 100% no-repeat;
  background-position: 0 -56px;
}
.systemImage3{
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url('/static/img/server-icon.png') 100% no-repeat;
  background-position: 0 -86px;
}
.systemImage4{
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url('/static/img/server-icon.png') 100% no-repeat;
  background-position: 0 -116px;
}

/*======公共弹窗========*/
.pop_title{
  /*overflow: hidden;*/
}
.pop_icon,.pop_operation,.pop_tabs{
  float: left;
  cursor: pointer;
}
.pop_icon{
  width: 50px;
  height: 48px;
  line-height: 48px;
  text-align: center;
  font-size: 24px;
}
.pop_operation{
  width: 140px;
  height: 48px;
}
.pop_tabs{
  width: calc(100% - 190px);
  padding-top: 6px;
}
.pop_tab{
  float: left;
  padding: 8px 10px;
  font-size: 12px;
  cursor: pointer;
}
.pop_tab_active{
  color: #3c73b9;
  border-bottom: 2px solid #007fdf;
}
.checkedLine{
  float: left;
  width: 10px;
  height: 100%;
  background-color: #fff;
  position: absolute;
  top: 0;
  right: 0px;
  z-index: 999;
}


.com_box {
  height: calc(100vh - 120px);
  overflow: hidden;
  position: relative;
}

.com_box2 {
  height: calc(100vh - 218px);
  overflow: hidden;
  position: relative;
}


/*关键设置 tbody出现滚动条*/
.item_tool{
  width: 100%;
  min-width: 1190px;
  height: 84px;
  padding-top: 29px;
  padding-right: 20px;
  box-sizing: border-box;
}
.item_form{
  float: left;
  height: 34px;
  margin-left: 50px;
}
.item_page{
  float: right;
  height: 34px;
}
.box-solid,.box-body{
  width: 100%;
}
.box-body{
  position: absolute;
  top: 84px;left:0px;right:0px;bottom:0px;
}


.pop_content .item_tool,.pop_content .box-solid,.pop_content .box-body{
  width: 100%;
  min-width: 100%;
}
.pop_content .box-body{
  position: relative;
}
.pop_content .box-body table{
  min-width: 100%;
}
.pop_content .box-body .ctab tbody{
  height: calc(100vh - 386px);
}


/*==========详情弹窗=========*/
.detail_overview{
  font-size: 14px;
  margin-top: 20px;
}
.detail_overview_border{
  border-right: 1px solid #dae0e6;
}
.detail_box{
  margin-bottom: 21px;
}
.detail_label{
  width: 126px;
  display: inline-block;
}
.detail_edit{
  display: none;
}
.detail_value:hover .detail_edit{
  display: inline-block;
}


.eidtmore-box {
  padding: 12px 0 0 0;
}
.eidtmore-box h1 {font-weight: 400;font-size:18px; border-bottom: solid 1px #efefef;height: 52px;line-height: 42px;}

.el-table__header th {font-weight: 400;font-size: 12px; color:#999;}
